<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
		<style type="text/css">
			*{
				padding: 0px;
				margin: 0px;
			}
			body {
				background-color: #2376bd;
			}
			#h1{
				border: 1px solid black;
				width: 701px;
				height: 491px;
				margin-top: 80px;
				
				margin-left: auto;
				margin-right: auto;
				background-image: url(images/login_pro.png);
				background-repeat: no-repeat;
				background-position: center;
			}
			#h2{
				width: 677px;
				height: 186px;
				margin-top: 40px;
				margin-left: auto;
				margin-right: auto;
				background-image: url(images/login_img.png);
				background-position: center;
				background-repeat: no-repeat;
			}
			#h3{
				width: 677px;
				height: 186px;
				background-position: ;
				background-repeat: no-repeat;
				background-image: url(images/login_logo.png);
				background-position: 65px;
				
			}
			#h4{
				border: 1px blue solid;
			}
			#h5,#h6,#h7{
				border: 1px #000000 solid;
				width: 300px;
				height: 39px;
				margin-bottom: 10px;
				margin-left: auto;
				margin-right: auto;
				display: flex;
				
			}
			#h8{
				border: 1px #000000 solid;
				width: 300px;
				height: 39px;
				margin-bottom: 10px;
				margin-left: auto;
				margin-right: auto;
				display: flex;
				/* justify-content: flex-end; */
				/* 垂直居中 */
				align-items: center;
			}
			#son1,#son3,#son5{
				border: 1px red solid;
				width: 63px;
				height: 35px;
				display: flex;
				/* 垂直水平居中 */
				justify-content: center;
				align-items: center
			}
			#input1{
				border: none;
				width: 300px;
				background-repeat: no-repeat;
				background-image: url(./images/login_user.png);
			}
			#input2{
				border: none;
				width: 300px;
				background-repeat: no-repeat;
				background-image: url(./images/login_password.png);
			}
			#input3{
				border: none;
				width: 300px;
				background-repeat: no-repeat;
				background-image: url(./images/login_yzm.png);
			}
			#submit1{
				border: none;
				width: 120px;
				height: 37px;
				background-image: url(images/login_btn.png);
				background-repeat: no-repeat;
				color: azure;
				font-size: 16px; /* 设置字体大小为 16 像素 */
			}
			#submit2{
				background-image: url(images/login_btn.png);
				font-size: 13px;
			}
			#h89{
				border: 1px red solid;
				width: 120px;
				margin-right: 0px;
			}
			#h88{
				border: 1px red solid;
				margin-left: 54px;
			}

		</style>
	</head>
	<body>
		<div id="h1">
			<div id="h2">
				<div id="h3">	
				</div>
			</div>
			<div id="h4">
				<form action="#" method="post">
					
					<div id="h5">
						<div id="son1">
							用户名
						</div>
						<input type="text" name="username" id="input1"/>
					</div>
					<div id="h6">
						<div id="son3">
							密&nbsp;&nbsp;码
						</div>
						<input type="password" name="userpassword" id="input2"/>
					</div>
					<div id="h7">
						<div id="son5">
							验证码
						</div>
						<input type="text" name="insure" id="input3" />
					</div>
					<div id="h8">
						<div id="h88">
							<input type="submit" name="login" id="submit1" value="登陆"/>
						</div>
						<div id="h89">
							<input type="checkbox" name="remember" id="submit2" value="RememberPassword" />记住密码
						</div>
					</div>
				</form>
			</div>
			
		</div>
	</body>
</html>
